<template>
  <el-table :data="tranList" style="width: 100%">
    <el-table-column type="index" label="序号" width="65" />
    <el-table-column property="tranNo" label="交易流水号" />
    <el-table-column property="clueDO.fullName" label="客户名" />
    <el-table-column property="money" label="交易金额" />
    <el-table-column property="expectedDate" label="预计成交日期" width="120" />
    <el-table-column
      property="stageDO.typeValue"
      label="交易所处阶段"
      width="120"
    />
    <el-table-column property="description" label="交易描述" />
    <el-table-column property="nextContactTime" label="下次联系时间" />
    <el-table-column label="操作" width="230" show-overflow-tooltip>
      <template #default="scope">
        <el-button type="danger" @click="del(scope.row.id)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  <p>
    <el-pagination
      background
      layout="prev, pager, next"
      :page-size="pageSize"
      :total="total"
      @prev-click="toPage"
      @next-click="toPage"
      @current-change="toPage"
    />
  </p>
</template>
<script setup>
import { ref, onMounted } from "vue";
import { useRoute } from "vue-router";
import { doGet, doPost, doDelete } from "../http/httpRequest.js";
import { getToken, goBack, messageTip, messageConfirm } from "../util/util.js";
import axios from "axios";
import router from "@/router/router";

const props = defineProps(["reload"]);
//客户列表数据对象，初始值是空
let tranList = ref([
  {
    clueDO: {},
    stageDO: {},
  },
]);
let pageSize = ref(0);
let total = ref(0);
let customerIdArray = ref([]);
onMounted(() => {
  getData(1);
});
function getData(current) {
  doGet("/api/tran", {
    current: current, //当前页，前面是参数名，后面是参数值
  }).then((resp) => {
    if (resp.data.code === 200) {
      Object.assign(tranList.value, resp.data.data.list);
      tranList.value.length = resp.data.data.list.length;
      pageSize.value = resp.data.data.pageSize;
      total.value = resp.data.data.total;
      console.log(tranList);
    }
  });
}
function toPage(number) {
  //number值是element-plus回调时传给我们的，number这个值就是当前页
  getData(number);
}
function del(id) {
  messageConfirm("你确定要删除?")
    .then(() => {
      doDelete("/api/tran/" + id, {}).then((resp) => {
        if (resp.data.code === 200) {
          messageTip("删除成功", "success");
          props.reload();
        } else {
          console.log(resp.data);
          messageTip("删除失败,原因：" + resp.data.msg, "error");
        }
      });
    })
    .catch(() => {
      messageTip("取消删除", "warning");
    });
}
</script>

<style scoped>
.el-table {
  margin-top: 10px;
}
</style>
